<template>
	<eui-page-frame :topHeight="240" :withOutBorder="true">
		<template #top>
			<view class="page_header">
				<eui-nav-bar color="black" backgroundColor="white" titleWeight="bold" :title="param.counterName" />
				<eui-tab style="border-radius: 0 0 10px 10px" backgroundColor="white" :tabs="tabData" :value="tabIndex"
					:showBadge="false" @change="tabChange"></eui-tab>
			</view>
		</template>
		<eui-page-content>
			<view v-show="tabIndex == '0'" style="position: relative;z-index:18;">
				<image :src="counterList?.[0]?.c_cover" style="height: 750rpx;width:750rpx;" />
				<eui-page-content style='margin-top:-40rpx;margin-left:20rpx;margin-right: 20rpx;width:auto;'>
					<eui-base-card style='height:162rpx;position:relative;z-index: 20;'>
						<view
							style="display: flex; flex-direction: row; justify-content: space-around; font-size: 20rpx;">
							<view style="display: flex; flex-direction: column; margin-top: 50rpx;">
								<view style="margin-bottom: 12rpx" class="font-type">
									<eui-uicons color="#00B9EE" size="20rpx" fontFamily="enjoyIcon5"
										customPrefix="icon-jingyingmianji" />
									经营面积
								</view>
								<view class='afterImage'>{{ counterList?.[0]?.c_use_area }}㎡</view>
							</view>
							<view style="display: flex; flex-direction: column; margin-top: 50rpx; ">
								<view style="margin-bottom: 12rpx" class="font-type">
									<eui-uicons color="#00B9EE" size="20rpx" fontFamily="enjoyIcon5"
										customPrefix="icon-suozailouceng" />
									所在楼层
								</view>
								<view class='afterImage'>
									{{ counterList?.[0]?.c_building_name||'' + '-' + counterList?.[0]?.c_floor_name||'' }}
								</view>
							</view>
							<view style="display: flex; flex-direction: column; margin-top: 50rpx; ">
								<view style="margin-bottom: 12rpx" class="font-type">
									<eui-uicons color="#00B9EE" size="20rpx" fontFamily="enjoyIcon5"
										customPrefix="icon-jingyingyetai" />
									经营业态
								</view>
								<view class='afterImage'>{{ counterList?.[0]?.c_counter_form_name }}</view>
							</view>
							<view style="display: flex; flex-direction: column; margin-top: 50rpx;">
								<view style="margin-bottom: 12rpx" class="font-type">
									<eui-uicons color="#00B9EE" size="20rpx" fontFamily="enjoyIcon5"
										customPrefix="icon-dangqianzhuangtai" />
									当前状态
								</view>
								<view class='afterImage'>{{ counterList?.[0]?.c_operation_name }}</view>
							</view>
						</view>
					</eui-base-card>
					<eui-base-card title='铺位详情' style='height:409rpx;'>
						<eui-detail-show v-if="!!counterList[0]" :items="counterDetailItem" labelWidth="70px"
							v-model="counterList[0]"></eui-detail-show>
					</eui-base-card>
					<eui-base-card title='当前租赁信息' style="height:478rpx;">
						<eui-detail-show v-if="!!counterList[0]" :items="currRentItem" labelWidth="70px"
							v-model="counterList[0]"></eui-detail-show>
						<image :src="counterList?.[0]?.c_counter_bcode_pic"
							style="height: 60rpx; width: 60rpx; margin-left: 70px" />
					</eui-base-card>
					<!-- <view style="text-align: center">
						<eui-button type="primary" title="生成铺位介绍图" />
					</view> -->
				</eui-page-content>
			</view>
			<view v-show="tabIndex == '1'">
				<eui-page-content style='margin-left:20rpx;margin-right: 20rpx;width:auto;'>
					<eui-base-card title="当前租赁信息" class='euicardtype'>
						<view v-if="counterList.length>0">
							<eui-detail-show v-if="!!counterList[0]" :items="currRentItem" labelWidth="80px"
								v-model="counterList[0]"></eui-detail-show>
						</view>
						<view v-else class="nodata">
							<image src="@/static/img/no_data.png" mode="aspectFit" class="nodata-image" />
						</view>
					</eui-base-card>
					<eui-base-card title="主费用信息" class='euicardtype' style='overflow: hidden;'>
						<view v-if='counterFeeDetail.list.length>0'>
							<eui-card-input style='margin-left: -215rpx;' v-model="counterFeeDetail.default"
								:range="counterFeeDetail.Button" type="radio" :showBottomLine="false" alignType="left"
								@buttonClick="curButtonClick" :displayable="false" />
							<eui-detail-show v-if="!!counterFeeDetail.data" :items="counterFeeItem" labelWidth="80px"
								v-model="counterFeeDetail.data"></eui-detail-show>
						</view>
						<view v-else class="nodata">
							<image src="@/static/img/no_data.png" mode="aspectFit" class="nodata-image" />
						</view>
					</eui-base-card>
					<eui-base-card title="历史租赁信息" class='euicardtype' style='overflow: hidden;'>
						<view v-if='preCounterDetail.list.length>0'>
							<eui-card-input style="margin-left: -215rpx" v-model="preCounterDetail.default"
								:range="preCounterDetail.Button" type="radio" :showBottomLine="false" alignType="left"
								@buttonClick="preButtonClick" :displayable="false" />
							<eui-detail-show v-if="!!preCounterDetail.data" :items="preRentItem" labelWidth="80px"
								v-model="preCounterDetail.data"></eui-detail-show>
							<image :src="preCounterDetail.data?.c_counter_bcode_pic"
								style="height: 60rpx; width: 60rpx; margin-left: 80px" />
						</view>
						<view v-else class="nodata">
							<image src="@/static/img/no_data.png" mode="aspectFit" class="nodata-image" />
						</view>
					</eui-base-card>
				</eui-page-content>
			</view>
			<view v-show="tabIndex == '2'">
				<eui-page-content style='margin-left:20rpx;margin-right: 20rpx;width:auto;'>
					<eui-base-card title="" class='euicardtype' style='overflow: hidden;'>
						<view
							style='font-size:30rpx;height:42rpx;margin-left: 28rpx;margin-top:28rpx;margin-bottom: 28rpx;font-weight:600'>
							当前计划</view>
						<view v-if="counterBusinessPlan.length>0">
							<view style='margin-bottom:40rpx;'><span class="planlabel"
									style='margin-right:16rpx;margin-left: 28rpx; color:#888888'>意向品类</span><span
									class="planlabel"
									style="color: #000000;">{{counterBusinessPlan[0].c_ccode_name}}</span>
							</view>
							<view style="display: flex; flex-direction: row; justify-content: space-around;">
								<view class='blocktype' style="margin-left:28rpx;">
									<view class='planlabel' style="color:#888888">计划开始
									</view>
									<view
										style='margin-bottom:20rpx;margin-top: 7rpx;line-height:40rpx;font-size: 28rpx;color:#000000'>
										{{ counterBusinessPlan?.[0]?.c_st_dt || ''}}
									</view>
								</view>
								<eui-line direction="col" length='80rpx'></eui-line>
								<view class='blocktype' style="margin-left:28rpx;">
									<view class='planlabel' style="color:#888888">计划结束</view>
									<view
										style='margin-bottom:20rpx;margin-top: 7rpx;line-height:40rpx;font-size: 28rpx;color:#000000'>
										{{ counterBusinessPlan?.[0]?.c_en_dt || ''}}
									</view>
								</view>
								<eui-line direction="col" length='80rpx'></eui-line>
								<view class='blocktype' style="margin-left:28rpx;">
									<view class='planlabel' style="color:#888888">合同截至</view>
									<view
										style='margin-bottom:20rpx;margin-top: 7rpx;line-height:40rpx;font-size: 28rpx;color:#000000'>
										{{ counterBusinessPlan?.[0]?.c_con_en_dt || ''}}
									</view>
								</view>
							</view>
							<view style='margin-bottom:20rpx;'><span class="planlabel"
									style='margin-right:16rpx;margin-left: 28rpx; color:#888888'>负责人</span><span
									class="planlabel"
									style="color: #000000;">{{counterBusinessPlan[0].c_ccode_name}}</span>
							</view>
						</view>
						<view v-else class="nodata">
							<image src="@/static/img/no_data.png" mode="aspectFit" class="nodata-image" />
						</view>
					</eui-base-card>
					<eui-base-card title='' class='euicardtype' style='width:710rpx;overflow: hidden;'>
						<view style='display: flex;flex-direction: row;align-items:center;'>
							<view
								style='font-size:30rpx;height:42rpx;margin-left:10rpx;margin-top:28rpx;margin-bottom: 28rpx;font-weight:600'>
								洽谈品牌</view>
							<eui-combox
								style='width:186rpx;height:42rpx;font-size:26rpx;height:37rpx;background-color: #F8F8F8; margin-left: auto;'
								:candidates="selectedItem.candidates" placeholder=""
								v-model="selectedItem.selected"></eui-combox>
						</view>
						<view v-if="TalkBrandList.Button.length>0 && TalkBrandList.BusinessTalk.length>0">
							<eui-card-input style="margin-left: -200rpx" v-model="TalkBrandList.default"
								:range="TalkBrandList.Button" type="radio" :showBottomLine="false" alignType="left"
								@buttonClick="talkBrandClick" :displayable="false" />
							<eui-base-card title="">
								<view v-if="TalkBrandList.BusinessTalk.length>0"
									style="display:flex;flex-direction:row;height:37rpx;margin-bottom: 28rpx;align-items:center; ">
									<view
										style='width:6rpx;height:28rpx;background-color:#02B7E6;border-radius:3rpx;margin-top:3rpx'>
									</view>
									<view style='font-size:30rpx;margin-left:10rpx;font-weight:600;'>
										洽谈进程
									</view>
								</view>
								<eui-detail-show v-if="TalkBrandList.BusinessTalk.length>0" :items="talkBrandItem"
									label-width="70px" v-model="TalkBrandList.BusinessTalk[0]"></eui-detail-show>
							</eui-base-card>
							<eui-steps :options="TalkBrandList.BusinessTalk" :active="active" type="plan"
								:themeColor="themeColor" style="font-size: 10rpx">
								<template v-slot:content="scope" style="margin-top: 16rpx">
									<view
										style="background: #f9fafc; border-radius: 10rpx; margin-top: 16rpx; padding: 20rpx">
										<view style="color: #666666">{{ scope.content }}</view>
										<view style="display: flex; margin-top: 20rpx" v-if="scope?.c_process_name">
											<eui-tag :text="scope?.c_process_name" plain plainFill :bgColor="themeColor"
												:color="themeColor" :borderColor="themeColor"></eui-tag>
										</view>
									</view>
								</template>
							</eui-steps>
						</view>
						<view v-else class="nodata">
							<image src="@/static/img/no_data.png" mode="aspectFit" class="nodata-image" />
						</view>
					</eui-base-card>
				</eui-page-content>
			</view>
			<view v-show="tabIndex == '3'">
				<eui-page-content style='margin-left:20rpx;margin-right: 20rpx;width:auto;'>
					<eui-base-card title="业态规划" class='euicardtype' style='overflow: hidden;'>
						<eui-detail-show v-if="!!counterList[0]" :items="ccodeItem" labelWidth="80px"
							v-model="counterList[0]"></eui-detail-show>
					</eui-base-card>
					<eui-base-card title="主费用标准" class='euicardtype' style='overflow: hidden;'>
						<view v-if="businessStandard.mainfee.length>0">
							<eui-base-card class="e-basecard" v-for="(item, index) in businessStandard.mainfee"
								v-model="businessStandard.mainfee" :key="index">
								<eui-detail-show v-if="businessStandard.mainfee[index]" :items="businessStandardItem"
									v-model="businessStandard.mainfee[index]"></eui-detail-show>
								<eui-line></eui-line>
							</eui-base-card>
						</view>
						<view v-else class="nodata">
							<image src="@/static/img/no_data.png" mode="aspectFit" class="nodata-image" />
						</view>
					</eui-base-card>
					<eui-base-card title="其他费用标准" class='euicardtype' style='overflow: hidden;'>
						<view v-if="businessStandard.otherfee.length>0">
							<eui-base-card class="e-basecard" v-for="(item, index) in businessStandard.otherfee"
								v-model="businessStandard.otherfee" :key="index">
								<eui-detail-show v-if="businessStandard.otherfee[index]" :items="businessStandardItem"
									labelWidth="80px" v-model="businessStandard.otherfee[index]"></eui-detail-show>
								<eui-line></eui-line>
							</eui-base-card>
						</view>
						<view v-else class="nodata">
							<image src="@/static/img/no_data.png" mode="aspectFit" class="nodata-image" />
						</view>
					</eui-base-card>
				</eui-page-content>
			</view>
		</eui-page-content>
	</eui-page-frame>
</template>

<script setup type="ts">

	import { ref, defineProps, watch } from 'vue';
import dayjs from 'dayjs';
import { todayAdd, formatNow } from '@/hooks/useUtils';
import { getRelatedName, getDictName, getDictList } from '../components/RelatedName.js';
import { init } from '@/hooks/init';
import { onShow, onLoad } from "@dcloudio/uni-app";
import apps from '@/pages/MainViews/app';
import useService from '@/hooks/useService';
import { storeToRefs } from 'pinia';
import { useThemeStore } from '@/store/themeStore';
const themeStore = useThemeStore(); // 主题
const { theme } = storeToRefs(themeStore);
const service = useService({ prefix: "apiApi" });
const themeColor = ref(theme._object.theme=='theme-blue'?'#02B7E6':'#FF6430')
const calcFeeType = getDictList('费用计算方式');
const calcMoreFeeType = getDictList('多级计算方法');
const calcModel = getDictList('基数种类');

const tabIndex = ref(0);
const moreCount = ref(0);
const spaceLeft = ref(6);
const tabData = ref([{ name: '铺位总览' }, { name: '租赁情况' }, { name: '招商计划' }, { name: '招商标准' }]);
const tabChange = (e) => {
	tabIndex.value = e;
}
//主费用默认选中按钮
const defaultButton = ref('');
//历史租赁信息中默认按钮
const preRentButton = ref('');


const param = ref({ storeId: '', counter: '',counterName:'' })
onLoad(async({ c_store_id,c_counter_no,c_counter_name }) => {
	console.log('=======c_store_id = '+c_store_id+' c_counter_no = '+c_counter_no+'  c_counter_name='+c_counter_name)
	param.value = {
		storeId: c_store_id,
		counter: c_counter_no,
		counterName:c_counter_name
	}
	await init();
	GetCounterData();
	GetBusinessStandard();
	GetTalkBrand();
});

//铺位信息
const counterList = ref([{
	c_floor_name:''
}]);
//招商计划
const counterBusinessPlan = ref([
	{
		c_ccode_name:'',
		c_bcode_name:'',
		c_plan_date:'',
		c_st_dt:'',
		c_en_dt:'',
		c_charge_username:'',
		c_con_en_dt:''
	}
]);
//租赁信息
const counterRentInfo = ref([]);
//主费用数据明细
const counterFeeDetail = ref({
	Button: [],
	default: '',
	list: [],
	data: {}
});

//历史租赁信息明细数据
const preCounterDetail = ref({
	Button: [],
	default: '',
	list: [],
	data: {}
});
//洽谈品牌数据
const talkBrandData = ref([]);
//招商标准信息
const businessStandard = ref({
	mainfee: [],
	otherfee: []
});


const curButtonClick = (localValue) => {
	counterFeeDetail.value.data = counterFeeDetail.value.list.find(x => x.value == localValue);
};

const preButtonClick = (localValue) => {
	preCounterDetail.value.data = preCounterDetail.value.list.find(x => x.c_counter_bcode == localValue);
};
//招商标准信息
const GetBusinessStandard = async () => {
	const req = {
		WhereList: [],
		store: param.value.storeId,
		counterNo: param.value.counter,
	}
	businessStandard.value = [];
	uni.showLoading({ title: "查询中...", mask: true });
	const data = await service.request('管易通铺位查询', 'QueryStandardInfoByParam', req);
	uni.hideLoading();
	if (data) {
		businessStandard.value.mainfee = data.filter(y => y.c_fee_property == '10').map(x => {
			return {
				...x,
				c_value:x?.c_value? x?.c_value+ '元/月':'',
				c_fee_code_name: `[${x.c_fee_code}]${x.c_fee_name}`,
				c_range_value: `${x.c_min_value} ~ ${x.c_max_value} `
			}
		});
		businessStandard.value.otherfee = data.filter(y => y.c_fee_property != '10').map(x => {
			return {
				...x,
				c_value:x?.c_value? x?.c_value+ '元/月':'',
				c_fee_code_name: `[${x.c_fee_code}]${x.c_fee_name}`,
				c_range_value: `${x.c_min_value} ~ ${x.c_max_value} `
			}
		});
	}
}
//洽谈品牌

const  TalkBrandList =ref({
	mainfee:[],
	otherfee:[],
	sumBrandTalkList:{},
	BusinessTalk:[],
	default:'',
	Button:[]
});
const talkBrandClick = (localValue) => {
	TalkBrandList.value.BusinessTalk =TalkBrandList.value.sumBrandTalkList[localValue].map(x=>{
		return {
			title: dayjs(x.c_talk_dt).format('YYYY-MM-DD'),
			text: `第${x.c_times}次沟通`,
			c_times:x.c_times,
			content:x.c_talk_memo,
			c_process_name:x.c_process_name,
			c_ccode:x.c_ccode?getRelatedName('rdsGdsclasses', x.c_ccode):'',
			c_talk_userno:x.c_talk_userno?getRelatedName('rdsUsers', x.c_talk_userno):'',
			c_provider:x.c_provider?getRelatedName('rdsProviders', x.c_provider):''
		}
	})
};

	
//洽谈进程的排序
const selectedvalue = ref('0')
const selectedItem = ref({
	candidates:[{value:'0',text:'按进程降序'},{value:'1',text:'按进程升序'}],
	selected:selectedvalue
})

watch(selectedvalue,(newvalue)=>{
TalkBrandList.value.BusinessTalk.sort((a,b)=>{
		return newvalue === '0'
		            ? b.c_times - a.c_times
		            : a.c_times - b.c_times;
	});
},{})




const active =ref(0)

const GetTalkBrand = async () => {
	const req = {
		WhereList: [],
		storeId: param.value.storeId,
		counter: param.value.counter,
	}
	uni.showLoading({ title: "查询中...", mask: true });
	const resdata = await service.request('管易通铺位查询', 'GetBusinessTalk', req);
	uni.hideLoading();
	const data = resdata?.ObjectData?.ds;
	if (data?.length>0) {

		TalkBrandList.value.mainfee = data.filter(y => y.c_fee_property == '10').map(x => {
			return {
				...x,
				c_fee_code_name: `[${x.c_fee_code}]${x.c_fee_name}`,
				c_range_value: `${x.c_min_value} ~ ${x.c_max_value} `
			}
		});
		TalkBrandList.value.otherfee = data.filter(y => y.c_fee_property != '10').map(x => {
			return {
				...x,
				c_fee_code_name: `[${x.c_fee_code}]${x.c_fee_name}`,
				c_range_value: `${x.c_min_value} ~ ${x.c_max_value} `
			}
		});



	let sumBrandTalk = data.reduce((acc,item)=>{

		 const bcode = item.c_bcode || '无品牌名称';
		  if (!acc[bcode]) {
		     acc[bcode] = [];
		   }
			acc[bcode].push(item);
			return acc;
		},{})

		TalkBrandList.value.sumBrandTalkList = sumBrandTalk;

		const firstKey = Object.keys(sumBrandTalk)[0];
		TalkBrandList.value.default = firstKey;
		// 使用 Set 去重
		const uniquebcode = [...new Set(data.map(item => item.c_bcode))];
		// 如果需要得到去重后的对象数组，可以这样做
		const uniqueBcodeObjects = uniquebcode.map(x => {
			return {
				text:x?getRelatedName('rdsBrands', x||''):'无品牌名称',
				value:x||'无品牌名称'
			};
		});

	    TalkBrandList.value.Button=uniqueBcodeObjects;

		const firstArray = sumBrandTalk[firstKey];
		TalkBrandList.value.BusinessTalk =firstArray.map(x=>{
			return {
				title: dayjs(x.c_talk_dt).format('YYYY-MM-DD'),
				text: `第${x.c_times}次沟通`,
				content:x.c_talk_memo,
				c_times:x.c_times,
				c_process_name:x.c_process_name,
				c_ccode:x.c_ccode?getRelatedName('rdsGdsclasses', x.c_ccode):'',
				c_talk_userno:x.c_talk_userno?getRelatedName('rdsUsers', x.c_talk_userno):'',
				c_provider:x.c_provider?getRelatedName('rdsProviders', x.c_provider):''
			}
		})
		active.value = TalkBrandList.value.BusinessTalk.length-1;
	}
}

//铺位数据
const GetCounterData = async () => {
	const req = {
		WhereList: [],
		storeId:param.value.storeId,
		counter: param.value.counter,
	}
	
	uni.showLoading({ title: "查询中...", mask: true });
	const data = await service.request('管易通铺位查询', 'GetCounterData', req);
	uni.hideLoading();
	if (data) {
		if (data.ds.length > 0) {
			counterList.value = [];
			counterList.value = data.ds.map(x => {
				return {
					c_no: x.c_no,
					c_name: x.c_name,
					c_store_id: x.c_store_id,
					c_built_area: x.c_built_area,
					c_use_area: x.c_use_area||'',
					c_building: x.c_building,
					c_floor: x.c_floor,
					c_counter_form: x.c_counter_form,
					c_status: x.c_status,
					c_abc: x.c_abc,
					c_place_class: x.c_place_class,
					c_place_class_name: getDictName('铺位位置属性', x.c_place_class),
					c_place_grade: x.c_place_grade,
					c_place_grade_name: getDictName('位置等级', x.c_place_grade)||'',
					c_area_no: x.c_area_no,
					c_merchant: x.c_merchant,
					c_operation: x.c_operation,
					c_owner_class: x.c_owner_class,
					c_owner_class_name: getDictName('产权属性', x.c_owner_class),
					c_owner_no: x.c_owner_no,
					c_estate_cond: x.c_estate_cond,
					c_estate_cond_name:x.c_estate_cond_name,
					c_con_no: x.c_con_no||'',
					c_st_dt: x.c_st_dt,
					c_en_dt: x.c_en_dt,
					c_rent_date: `${dayjs(x.c_st_dt).format('YYYY-MM-DD')} ~ ${dayjs(x.c_en_dt).format('YYYY-MM-DD')}`,
					c_provider: x.c_provider?`[${x.c_provider}]${getRelatedName('rdsProviders',x.c_provider)}`:'',
					c_counter_bcode: x.c_counter_bcode,
					c_ccode: x.c_ccode,
					c_bcode: x.c_bcode,
					c_building_name: x?.c_building_name || '',
					c_floor_name: x?.c_floor_name||'',
					c_counter_form_name:x.c_counter_form?`[${x.c_counter_form}]${getRelatedName('rdsGdsclasses',x.c_counter_form)}`:'',
					c_counter_bcode_name:x.c_counter_bcode?`[${x.c_counter_bcode}]${getRelatedName('rdsBrands',x.c_counter_bcode)}`:'',
					c_operation_name:x.c_operation_name,
					c_cover: x.c_pic_guid ? (service.getBaseUrl() + '/File/DownLoadFile/' + x.c_pic_guid) : ('../../../static/img/no_image.png'),
					c_counter_bcode_pic:x.c_counter_bcode_pic ? (service.getBaseUrl() + '/File/DownLoadFile/' + x.c_counter_bcode_pic) : ('../../../static/img/no_image.png'),
					c_provider_name:x.c_provider_name,
					c_plan_counter_form_name:x.c_plan_counter_form?`[${x.c_plan_counter_form}]${getRelatedName('rdsGdsclasses',x.c_plan_counter_form)}`:'',
					c_plan_bcode_name:x.c_plan_bcode_name
				}
			});
			counterBusinessPlan.value = [];
			counterBusinessPlan.value = data.ds1.map(x => {
				return {
					c_id: x.c_id||'',
					c_store_id: x.c_store_id||'',
					c_counter_no: x.c_counter_no||'',
					c_ccode: x.c_ccode||'',
					c_ccode_name:x.c_ccode?`[${x.c_ccode}]${getRelatedName('rdsGdsclasses',x.c_ccode)}`:'',
					c_bcode: x.c_bcode||'',
					c_bcode_name:x.c_bcode_name||'',
					c_st_dt:dayjs(x.c_st_dt).format('YYYY-MM-DD'),
					c_en_dt:dayjs(x.c_en_dt).format('YYYY-MM-DD'),
					c_con_en_dt:dayjs(x.c_con_en_dt).format('YYYY-MM-DD'),
					c_charge_userno: x.c_charge_userno,
					c_charge_username:x.c_charge_userno?`[${x.c_charge_userno}]${getRelatedName('rdsUsers',x.c_charge_userno)}`:'',
				}
			});
			counterRentInfo.value= [];
			counterRentInfo.value = data.ds3;
			
			preCounterDetail.value.list = [];
			preCounterDetail.value.list = data.ds4.map(x => {
				return {
					c_counter_form: x.c_counter_form,
					c_con_no: x.c_con_no||'',
					c_st_dt: x.c_st_dt,
					c_en_dt: x.c_en_dt,
					c_rent_date: `${dayjs(x.c_st_dt).format('YYYY-MM-DD')} 至 ${dayjs(x.c_en_dt).format('YYYY-MM-DD')}`,
					c_provider: x.c_provider?`[${x.c_provider}]${getRelatedName('rdsProviders',x.c_provider)}`:'',
					c_provider_name:x.c_provider_name,
					c_counter_bcode: x.c_counter_bcode,
					c_counter_bcode_name:x.c_counter_bcode?`[${x.c_counter_bcode}]${getRelatedName('rdsBrands',x.c_counter_bcode)}`:'',
					c_counter_bcode_pic:x.c_counter_bcode_pic ? (service.getBaseUrl() + '/File/DownLoadFile/' + x.c_counter_bcode_pic) : ('../../../static/img/no_image.png'),
					c_counter_form_name:x.c_counter_form?`[${x.c_counter_form}]${getRelatedName('rdsGdsclasses',x.c_counter_form)}`:'',
				}
			});
			
			preCounterDetail.value.Button = [];
			preCounterDetail.value.Button = data.ds4.map(x => {
				return {
					text: x.c_counter_bcode_name || '无品牌名称',
					value: x.c_counter_bcode||'',
				}
			})
			
			preCounterDetail.value.default ='';
			preCounterDetail.value.default = preCounterDetail.value?.Button[0]?.value||'';
			
			preCounterDetail.value.data = {}
			preCounterDetail.value.data = preCounterDetail.value.list?.[0];

			const feeIdBox = data.ds3.filter(f => f.c_article_code).filter((t, i) => data.ds3.findIndex((t1) => t1.c_article_code == t.c_article_code) == i).map(t => t.c_fee_id);
			
		    const feeList	= data.ds3.filter(x => feeIdBox.includes(x.c_fee_id)).map(y => {
				const feeModel = ref([]);
				if (y.c_is_plan != 1) {

					const calcType =y.c_calc_type ? getDictName('费用计算方式',y.c_calc_type): null;
					const calcMode = (y.c_calc_mode && y.c_calc_mode !== '0') ? getDictName('多级计算方法', y.c_calc_mode): null;
					const baseKind =y.c_base_kind ? getDictName('基数种类',y.c_base_kind): null;
					feeModel.value = [baseKind, calcType, calcMode]
				}
				else {
					const baseKind =y.c_base_kind ? getDictName('基数种类',y.c_base_kind) : null;
					feeModel.value = [baseKind]
				}
				return {
					text: y.c_fee_name,
					value: y.c_fee_id,
					c_fee_model: feeModel.value.toString(),
					c_amount: y.c_amount,
					c_rate: y.c_rate
				}
			});
			
			counterFeeDetail.value.list  = feeList;
		    counterFeeDetail.value.Button.value =[];
			counterFeeDetail.value.Button =data.ds3.filter(x => feeIdBox.includes(x?.c_fee_id)).
			filter((item, index, self) =>index === self.findIndex((t) => t.c_fee_id === item.c_fee_id)).map(y => {
				return {
					text: y?.c_fee_name,
					value: y?.c_fee_id,
				}
			});
			
			counterFeeDetail.value.data ={};
			counterFeeDetail.value.data = counterFeeDetail.value.list?.[0];
			
			
			counterFeeDetail.value.default = ''
			counterFeeDetail.value.default = counterFeeDetail.value.Button[0]?.value||'';
		
		}
	}
}
//业态规划
const ccodeItem = [
	{
		label: "规划品类",
		prop: "c_plan_counter_form_name",
		type: "text",
		colSpan: 12,
	},
	{
		label: "规划品牌",
		prop: "c_bcode_name",
		type: "text",
		colSpan: 12,
	},
];


//洽谈品牌
const talkBrandItem = [{
		label: "业态",
		prop: "c_ccode",
		type: "text",
		colSpan: 24,
	},
	{
		label: "洽谈对象",
		prop: "c_provider",
		type: "text",
		colSpan: 24,
	},
	{
		label: "洽谈人",
		prop: "c_talk_userno",
		type: "text",
		colSpan: 24,
	},
	];

const counterDetailItem = [
	{
		label: "位置等级",
		prop: "c_place_grade_name",
		type: "text",
		colSpan: 12,
	},
	{
		label: "建筑面积",
		prop: "c_built_area",
		type: "text",
		colSpan: 12,
		element: {
		 precision:2
		}
	},
	{
		label: "位置属性",
		prop: "c_place_class_name",
		type: "text",
		colSpan: 12,
	},
	{
		label: "铺位等级",
		prop: "c_abc",
		type: "text",
		colSpan: 12,
	},
	{
		label: "产权属性",
		prop: "c_owner_class_name",
		type: "text",
		colSpan: 12,
	},
	{
		label: "产权编号",
		prop: "c_owner_no",
		type: "text",
		colSpan: 12,
		element: {

		}
	},
	{
		label: "物业条件",
		prop: "c_estate_cond_name",
		type: "tag",
		colSpan: 24,
		element: {
			size: "mini",
			shape: "square",
			color:themeColor.value,
			bgColor:themeColor.value,
		    borderColor:themeColor.value,
			plain: true,
			plainFill:true
		}
	}
]

const currRentItem = [
	{
		label: "合同号",
		prop: "c_con_no",
		type: "text",
		colSpan: 24,
	},
	{
		label: "租期",
		prop: "c_rent_date",
		type: "text",
		colSpan: 24,
		element: {

		}
	},
	{
		label: "经营商户",
		prop: "c_provider",
		type: "text",
		colSpan: 24,
	},
	{
		label: "经营品牌",
		prop: "c_counter_bcode_name",
		type: "text",
		colSpan: 24,
	}]
const preRentItem = [
	{
		label: "业态",
		prop: "c_counter_form_name",
		type: "text",
		colSpan: 12,
	},
	{
		label: "合同号",
		prop: "c_con_no",
		type: "text",
		colSpan: 24,
	},
	{
		label: "合同租期",
		prop: "c_rent_date",
		type: "text",
		colSpan: 24
	},
	{
		label: "经营商户",
		prop: "c_provider",
		type: "text",
		colSpan: 24,
	},
	{
		label: "经营品牌",
		prop: "c_counter_bcode_name",
		type: "text",
		colSpan: 24,
	}]

const counterFeeItem = [
	{
		label: "计费方式",
		prop: "c_fee_model",
		type: "tag",
		colSpan: 24,
		element: {
			type: "success",
			size: "mini",
			shape: "circle",
			plain: true,
		}
	},
	{
		label: "固定金额",
		prop: "c_amount",
		type: "text",
		colSpan: 24,
		element: {
			precision: 2,
		}
	},
	{
		label: "固定费率",
		prop: "c_rate",
		type: "text",
		colSpan: 24,
		element: {
			precision: 2,
		}
	}];
const curentBusinessItem = [
	{
		label: "意向品类",
		prop: "c_ccode_name",
		type: "text",
		colSpan: 24
	},
	{
		label: "意向品牌",
		prop: "c_bcode_name",
		type: "text",
		colSpan: 24,
	},
	{
		label: "计划时间",
		prop: "c_plan_date",
		type: "text",
		colSpan: 24,
	},
	{
		label: "负责人",
		prop: "c_charge_username",
		type: "text",
		colSpan: 12,
	},
	{
		label: "原合同截至",
		prop: "c_con_en_dt",
		type: "text",
		colSpan: 24,
		element: {
			mode: "YYYY-MM-DD",
		},
	}
]
//主费用标准
const businessStandardItem = [
	{
		label: "",
		prop: "c_fee_code_name",
		type: "text",
		colSpan: 12
	},
	{
		label: "",
		prop: "c_value",
		type: "text",
		colSpan: 12,
		textAlign:'right'
	},
];
</script>

<style lang="scss">
	@import '../../../static/font/enjoyicon5.0/iconfont.css';

	::v-deep .white-main {
		border-radius: 0 !important;
	}

	::v-deep .white-main img {

		overflow: auto !important;
		position: absolute !important;
		left: 0 !important;
		right: 0 !important;
	}



	.blocktype {
		width: 236.67rpx;
		height: 124rpx;
	}

	.planlabel {
		font-size: 26rpx;
		height: 37rpx;
		font-family: 'PingFang SC', sans-serif;
		font-weight: normal;
	}

	.nodata {
		width: 100%;
		height: 400rpx;

		image {
			width: 100%;
			height: 80%;
			opacity: 0.4;
		}
	}

	.page_header {
		width: 100%;
		height: 225rpx;
		background-color: white;
	}

	.euicardtype {
		font-family: 'PingFang SC', sans-serif;
		font-weight: normal;
	}

	.font-type {
		font-size: 22rpx;
		color: #888888;
		font-family: 'PingFang SC', sans-serif;
		font-weight: normal;
		text-align: left;
		height: 30rpx;
	}

	.afterImage {
		font-size: 28rpx;
		color: #000000;
		font-family: "PingFang SC", "Heiti SC", "Arial", sans-serif;
		font-weight: normal;
		text-align: left;
		height: 40rpx;
	}
</style>